<!--
 * @Author: gao_m3
 * @Date: 2022-08-15 15:32:21
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-08-23 11:41:16
 * @Descripttion: 
-->
<template>
  <div class="view">
    <fm-nav-bar
      title="CBE模型"
      left-arrow
      @click-left="$router.go(-1)"
    ></fm-nav-bar>
    <div class="imodelview" id="imodelview"></div>
  </div>
</template>

<script>
import { IModelApp } from '@bentley/imodeljs-frontend'
import { ColorDef } from '@bentley/imodeljs-common'
import { DisplayTestApp } from '@/components/cyber-twin-bim/simpleViewApp'

export default {
  name: 'CyberTwinBim',
  data() {
    return {
      iminfo: {
        iModelId: '1a11715d-e662-4da9-b5e4-ec46598aaee6',
        versionId: 'ed5f5d09a2203d513e013285c1d8968f06b6d4de',
      },
      modelbgColor: '#BACCD9',
      hiliteColor: 'rgb(6, 206, 174)',
    }
  },
  components: {},
  watch: {},
  created() {
    this.main()
  },
  mounted() {},
  async beforeDestroy() {
    if (IModelApp.viewManager.selectedView) {
      await IModelApp.viewManager.selectedView.view.iModel.close()
      IModelApp.viewManager.dropViewport(IModelApp.viewManager.selectedView)
    }
    await IModelApp.shutdown()
  },
  methods: {
    async main() {
      // dev
      //localStorage.setItem('access_token', 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJjbGllbnRJZCI6ImVjZjcxOTlmYTFiMTRiMzQ0NTc4ODA3OWZkYjg1MmI1IiwidXNlcl9uYW1lIjoiemhvdV9kdyIsInNleCI6IueUtyIsInVzZXJObyI6IjIwMjAwMjAiLCJ1c2VyTmFtZSI6Inpob3VfZHciLCJjbGllbnRfaWQiOiJlY2Y3MTk5ZmExYjE0YjM0NDU3ODgwNzlmZGI4NTJiNSIsImF2YXRhclRva2VuIjpudWxsLCJsaWNlbnNlIjoicG93ZXJlZCBieSBmYXdrZXMiLCJhdWQiOlsib2F1dGgyLXJlc291cmNlIiwib2F1dGgyLXNlcnZlciJdLCJwaG9uZSI6IjEzNjA2ODA2NDA5Iiwic2NvcGUiOlsiYWxsIl0sInRlbmFudElkIjoxMDAwMTcsInVzZXJGdWxsbmFtZSI6IuWRqOS4nOeCnCIsImlkIjoiMTI4NTE0Nzc5NTQzNTI1Mzc2MSIsInVzZXJUeXBlIjoxLCJleHAiOjE2NTcxNjE0MDUsImp0aSI6ImVhMGZkZWJlLWRiM2UtNDZmMy1hMjY5LTJlMjY4NjM4MWM5ZiIsImVtYWlsIjoiIn0.9y__zbs61CPBX7tGMuyPYh_V440-KTOgIkVq7k1YJcU')

      //hdec
      // localStorage.setItem('access_token', 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJjbGllbnRJZCI6ImVjZjcxOTlmYTFiMTRiMzQ0NTc4ODA3OWZkYjg1MmI1IiwidXNlcl9uYW1lIjoiemhvdV9kdyIsInNleCI6IueUtyIsInVzZXJObyI6IjIwMjAwMjAiLCJ1c2VyTmFtZSI6Inpob3VfZHciLCJjbGllbnRfaWQiOiJlY2Y3MTk5ZmExYjE0YjM0NDU3ODgwNzlmZGI4NTJiNSIsImF2YXRhclRva2VuIjpudWxsLCJsaWNlbnNlIjoicG93ZXJlZCBieSBmYXdrZXMiLCJhdWQiOlsib2F1dGgyLXJlc291cmNlIiwib2F1dGgyLXNlcnZlciJdLCJwaG9uZSI6IjEzNjA2ODA2NDA5Iiwic2NvcGUiOlsiYWxsIl0sInRlbmFudElkIjoxMDAwMTcsInVzZXJGdWxsbmFtZSI6IuWRqOS4nOeCnCIsImlkIjoiMTI4NTE0Nzc5NTQzNTI1Mzc2MSIsInVzZXJUeXBlIjoxLCJleHAiOjE2NTcxNjE0MDUsImp0aSI6ImVhMGZkZWJlLWRiM2UtNDZmMy1hMjY5LTJlMjY4NjM4MWM5ZiIsImVtYWlsIjoiIn0.9y__zbs61CPBX7tGMuyPYh_V440-KTOgIkVq7k1YJcU')
      // this.iminfo = {
      //   iModelId: '1294af60-b9da-4d55-b988-45ac4735ba44',
      //   versionId: 'c4686e557c882c097312294e0835b0e299f9f598'
      // }

      try {
        await DisplayTestApp.initialize({})

        const connection = await DisplayTestApp.openOnlineIModel(
          this.iminfo.iModelId,
          this.iminfo.versionId
        )

        await DisplayTestApp.openView(connection, 'imodelview')
        window.mainVp = IModelApp.viewManager.selectedView

        IModelApp.tools.run(
          'View.Fit',
          IModelApp.viewManager.selectedView,
          true
        )

        //全局颜色设置
        IModelApp.viewManager.selectedView.hilite.color = ColorDef.fromString(
          this.hiliteColor
        )
        IModelApp.viewManager.selectedView.view.displayStyle.backgroundColor = ColorDef.create(
          this.modelbgColor
        )
      } catch (error) {
        this.loadingfail = true
        throw error
      }
    },
  },
}
</script>

<style scoped>
/* /deep/.imodeljs-icon {
  visibility: hidden;
} */
.view {
  width: 100%;
  height: 100%;
}

.imodelview {
  height: 110%;
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-color: #fff;
}
</style>
